<template>
  <div class="page">
    <sider-bar></sider-bar>

    <div class="content-layout">
      <router-view></router-view>
    </div>


  </div>
</template>

<script setup lang="ts">

import SiderBar from "@/views/common/sider-bar.vue";

</script>

<style >
.page {
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: row;
}



.content-layout {
  margin-bottom: 10px;
  height: 100%;
  width: 100%;
}

.content-layout::-webkit-scrollbar { /*滚动条整体样式*/
  width: 5px; /*高宽分别对应横竖滚动条的尺寸*/
  height: 10px;
  scrollbar-arrow-color: gray;

}

.content-layout::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
  border-radius: 5px;
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  scrollbar-arrow-color: gray;
}

.content-layout::-webkit-scrollbar-track { /*滚动条里面轨道*/
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  border-radius: 0;
  background: rgba(0, 0, 0, 0.1);
}
</style>